<template>
  <div class="app-container">
    <!-- 条件栏 -->
    <div class="filter-wrapper">
      <new-page-filter
        ref="pageFilter"
        v-model:query="filterInfo.query"
        :filter-list="filterInfo.searchList"
        :filter-btn="filterInfo.searchBtn"
      >
        <template v-slot:filter-operateTime>
          <el-date-picker
            v-model="time"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            type="daterange"
            range-separator="至"
            :picker-options="$fn.pickerOptionsFn()"
            align="right"
            start-placeholder="操作时间开始日期"
            end-placeholder="操作时间结束日期"
            @change="timeChange"
          ></el-date-picker>
        </template>
      </new-page-filter>
    </div>

    <div class="filter-wrapper">
      <new-page-filter :filter-btn="filterInfo.btnList">
        <template v-slot:filter-print>
          <el-button
            v-if="$permission('useDeptSummary:printDetail')"
            @click="print"
            >打印</el-button
          >
        </template>
        <template v-slot:filter-excel>
          <el-button
            v-if="$permission('useDeptSummary:excelDetail')"
            @click="exportExcel"
            >导出excel</el-button
          >
        </template>
      </new-page-filter>
    </div>
    <!-- 表格 -->
    <table-container
      :refresh="tableInfo.refresh"
      :init-curpage="tableInfo.initCurpage"
      v-model:data="tableInfo.data"
      :api="tableInfo.api"
      :summary="true"
      :summary-field-list="tableInfo.summaryFieldList"
      :tab-index="true"
      :check-box="false"
      :query="filterInfo.query"
      :field-list="tableInfo.fieldList"
      @handleEvent="handleEvent"
    >
    </table-container>
  </div>
</template>

<script setup name="useDeptSummary">
import {
  excelUseDeptSummary,
  printUseDeptSummary,
  getUseDeptSummaryPage,
} from '@/api/dataQuery.js'
import moment from 'moment'
import { fatchTemplateByCode } from '@/api/base'
import { getDeptAll } from '@/api/core'
const { proxy } = getCurrentInstance()
const filterInfo = ref({
  query: {
    sort: 'create_time desc',
    operateTimeGreater: moment(
      new Date(new Date().getTime() - 3600 * 1000 * 24 * 30)
    ).format('YYYY-MM-DD'),
    operateTimeLesser: moment(new Date()).format('YYYY-MM-DD'),
  },
  searchList: [
    {
      // componentType: "daterange",
      label: '统计时间',
      slot: true,
      value: 'operateTime',
      event: search,
    },

    {
      label: '使用部门',
      value: 'deptIdMult',
      query: {
        deptAuth: 'id',
        status: 1,
      },
      api: getDeptAll,
      componentType: 'slip-select',
      multiple: true,
      event: search,
    },
  ],
  searchBtn: [{ type: 'button', label: '搜索', event: search }],
  btnList: [
    {
      value: 'print',
      type: 'slot',
    },
    {
      value: 'excel',
      type: 'slot',
    },
  ],
})
const time = ref([
  moment(new Date(new Date().getTime() - 3600 * 1000 * 24 * 30)).format(
    'YYYY-MM-DD'
  ),
  moment(new Date()).format('YYYY-MM-DD'),
])

const tableInfo = ref({
  refresh: 1,
  initCurpage: 1,
  data: [],
  api: getUseDeptSummaryPage,
  selections: [],
  summaryFieldList: [{ value: 'amount', formatter: proxy.$fn.qtyFormatter }],
  fieldList: [
    { label: '领用科室', value: 'deptName' },
    { label: '采购金额', value: 'amount' },
  ],
})
onMounted(() => {
  getList()
})
function getList() {
  tableInfo.value.refresh = Math.random()
}

function search() {
  if (
    filterInfo.value.query.operateTimeGreater &&
    filterInfo.value.query.operateTimeLesser
  ) {
    tableInfo.value.initCurpage = Math.random()
    tableInfo.value.refresh = Math.random()
    return
  } else {
    proxy.$message.warning('请选择操作时间！')
  }
}
function handleEvent(event, data) {
  switch (event) {
    case 'tableCheck':
      tableInfo.value.selections = [...data]
      break
  }
}

function exportExcel() {
  if (
    filterInfo.value.query.operateTimeGreater &&
    filterInfo.value.query.operateTimeLesser
  ) {
    excelUseDeptSummary(
      proxy.$fn.delEmptyAttribute(filterInfo.value.query)
    ).then((resp) => {
      if (resp) {
        proxy.$fn.parseExcel(resp)
      }
    })
    return
  } else {
    proxy.$message.warning('请选择操作时间！')
  }
}

function timeChange(val) {
  if (val && val.length) {
    filterInfo.value.query.operateTimeGreater = val[0]
    filterInfo.value.query.operateTimeLesser = val[1]
  } else {
    filterInfo.value.query.operateTimeGreater = ''
    filterInfo.value.query.operateTimeLesser = ''
  }
}
//打印
function print() {
  if (
    filterInfo.value.query.operateTimeGreater &&
    filterInfo.value.query.operateTimeLesser
  ) {
    fatchTemplateByCode({
      resourceCode: 'useDeptSummary:printDetail',
      isDefault: 1,
    }).then((res) => {
      if (res && res.success) {
        let temp = proxy.$fn.getPrintTemp(res.data[0])
        getPrintData(temp)
      }
    })
    return
  } else {
    proxy.$message.warning('请选择操作时间！')
  }
}
function getPrintData(temp) {
  printUseDeptSummary(filterInfo.value.query).then((res) => {
    if (res.success && res) {
      let data = proxy.$fn.deepClone(res.data)
      let newData = data.map((item) => {
        return {
          ...item,
          ...item.orderInfo,
        }
      })
      proxy.$lodop.preview(temp, newData)
    }
  })
}
</script>

<style scoped></style>
